<h2>Run HelloWorld using JavaFX SDK</h2>

<p>
    If you want to use the JavaFX SDK instead of a build tool, download an appropriate
    <a target="_blank" href="https://gluonhq.com/products/javafx/">JavaFX runtime</a>
    for your operating system and unzip it to a desired location.
    For this tutorial, we will be using JavaFX <span class="JFX_VERSION">11</span>.
</p>

<p>
    Add an environment variable pointing to the <kbd>lib</kbd> directory of the runtime:
</p>

<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link active" href="#nix-env" data-toggle="tab">Linux/Mac</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#win-env" data-toggle="tab">Windows</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="nix-env">
<pre class="no-border-radius"><code>
export PATH_TO_FX=path/to/javafx-sdk-<span class="JFX_VERSION">11</span>/lib
</code></pre>
    </div>
    <div class="tab-pane" id="win-env">
<pre><code>
set PATH_TO_FX="path\to\javafx-sdk-<span class="JFX_VERSION">11</span>\lib"
</code></pre>
    </div>
</div>

<p>
    You can now compile and run JavaFX applications from the command line using the JavaFX runtime.
</p>

<p>
    Compile the application (e.g. use <a class="samples" href="https://github.com/openjfx/samples/blob/master/HelloFX/CLI/hellofx/HelloFX.java" target="_blank">HelloFX.java</a> 
    from this <a class="samples" href="https://github.com/openjfx/samples/blob/master/HelloFX/CLI" target="_blank">sample</a>) using:
</p>

<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link active" href="#nix-javac" data-toggle="tab">Linux/Mac</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#win-javac" data-toggle="tab">Windows</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="nix-javac">
<pre class="no-border-radius"><code>
javac --module-path $PATH_TO_FX --add-modules javafx.controls HelloFX.java
</code></pre>
    </div>
    <div class="tab-pane" id="win-javac">
<pre><code>
javac --module-path %PATH_TO_FX% --add-modules javafx.controls HelloFX.java
</code></pre>
    </div>
</div>

<p>
    <b>Important</b>: Make sure to add the required modules, keeping into account transitive dependencies are automatically resolved
    (for instance, there is no need to add <kbd>javafx.graphics</kbd> module, since it is
    <a href="https://openjfx.io/javadoc/12/javafx.controls/module-summary.html" target="_blank">transitively</a> required by the
    <kbd>javafx.controls</kbd> module). But if your application is using <kbd>FXML</kbd>, you will need to
    add the <kbd>javafx.fxml</kbd> module as well, as shown below:
</p>

<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link active" href="#nix-fxml" data-toggle="tab">Linux/Mac</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#win-fxml" data-toggle="tab">Windows</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="nix-fxml">
<pre class="no-border-radius"><code>
javac --module-path $PATH_TO_FX --add-modules javafx.controls,javafx.fxml HelloFX.java
</code></pre>
    </div>
    <div class="tab-pane" id="win-fxml">
<pre><code>
javac --module-path %PATH_TO_FX% --add-modules javafx.controls,javafx.fxml HelloFX.java
</code></pre>
    </div>
</div>

<p>
Finally, run the application using:
</p>

<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link active" href="#nix-java" data-toggle="tab">Linux/Mac</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#win-java" data-toggle="tab">Windows</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="nix-java">
<pre class="no-border-radius"><code>
java --module-path $PATH_TO_FX --add-modules javafx.controls HelloFX
</code></pre>
    </div>
    <div class="tab-pane" id="win-java">
<pre><code>
java --module-path %PATH_TO_FX% --add-modules javafx.controls HelloFX
</code></pre>
    </div>
</div>